<template>
  <div class="status">
    <div class="status-flx-left">
       <span v-if="items.order.status==5">{{items.order.statusDes}}</span>
      <span v-if="items.order.status==4">等待买家收货</span>
      <span v-if="items.order.status==2">订单取消</span>
      <span v-if="items.order.status==1">待发货</span>
      <div v-if="items.order.status==0">
        <div>等待买家付款</div>
        <div style="font-size:0.3467rem;margin-top:0.2667rem">剩 {{countDownTime}}<br/>自动取消该订单</div>
      </div>
    </div>
    <div class="status-flx-right">
      <img v-if="items.order.status==5&&items.order.statusDes=='交易完成'" :src="img5" />
       <img v-if="items.order.status==5&&items.order.statusDes=='待评价'" :src="img6" />
      <img v-if="items.order.status==4" :src="img1" />
      <img v-if="items.order.status==2" :src="img2" />
      <img v-if="items.order.status==1" :src="img3" />
      <img v-if="items.order.status==0" :src="img4" />
    </div>
  </div>
</template>
<script>
import cart from "@/assets/images/carted.png";
import img2 from "@/assets/images/od_cancel.png";
import img3 from "@/assets/images/od_penship.png";
import img4 from "@/assets/images/od_penpay.png"
import img5 from "@/assets/images/od_dealdone.png"
import img6 from "@/assets/images/od_peneva.png"
import { setTimeout } from "timers";
export default {
  props: ["items"],
  model: {
    prop: "items"
  },
  data() {
    return {
      img1: cart,
      img2: img2,
      img3: img3,
      img4:img4,
      img5:img5,
      img6:img6,
      countDownTime:""
    };
  },
  watch: {
    "items.order.status": function(val) {
      if (val == 0) {
        
        this.countDown(this.items.order.countDownTime)
      }
    }
  },
  computed: {
    text() {
      return "等待买家收货";
    },
    url() {
      return this.img1;
    }
  },
  methods: {
    countDown(count) {
      let _this=this;
     //  let count=_this.items.order.countDownTime;
        let time=Math.abs(count);
      if (time>=0) {
        
         var min = Math.floor(time % 3600);
          let m =
            Math.floor(time / 3600) +
            " 小时 " +
            Math.floor(min / 60) +
            " 分 " +
            time % 60 +
             " 秒 ";
              _this.countDownTime=m;
        setTimeout(function() {
         count++
         console.log(m)
       
         _this.countDown(count)
        },1000);
      }
    }
  }
};
</script>
<style lang="scss" scoped>
.status {
  display: flex;
  height: 100%;
  .status-flx-left {
    flex: 1;
    display: flex;
    align-items: center;
    font-weight: bold;
    color: rgba(255, 255, 255, 1);
    font-size: 0.4533rem;
    padding-left: 0.32rem;
  }
  .status-flx-right {
    display: flex;
    justify-content: center;
    align-items: center;
    padding-right: 0.9733rem;
    img {
      width: 1.7867rem;
      // height: 1.3333rem;
    }
  }
}
</style>
